{% extends 'admin/change_form.html' %}

{% block object-tools %}
<style>
    .export-btn-box {
        padding: 6px;
        outline: none;
        border: none;
    }
    .category-extra-action-box {
        display: flex;
        gap: 8px;
        align-items: center;
    }

</style>


    {{ block.super }}

    {% if change  %}

        <div class="category-extra-action-box">
            <input id="targetCategoryInput" type="text" name="target"  placeholder="请输入要合并的分类名称"/>
            <button class="export-btn-box" onclick="mergeCategory()">合并分类名称</button>
        </div>
    {% endif %}
<script>
    function mergeCategory() {
        var sourceObj = document.querySelector('#content>h2')
        var sourceCategoryName = sourceObj.innerText
        var targetObj = document.querySelector("#targetCategoryInput")
        var targetCategoryName = targetObj.value
        if(targetCategoryName === '') {
            alert("请输入分类名称")
            return false
        }  else {
            var merge_api = "/api/merge-category/?target=" + targetCategoryName + "&source=" + sourceCategoryName
           fetch(merge_api)
                .then(response => {
                    // 处理响应
                    console.log(response)
                })
                .catch(error => {
                    // 处理错误
                   console.log(error)
                });
        }

    }
</script>
{% endblock %}